import React, { lazy, Suspense } from 'react';
import { createBrowserRouter, Navigate } from 'react-router-dom';
import MainLayout from '../layouts/MainLayout';

// 使用懒加载提升性能
const Dashboard = lazy(() => import('../pages/dashboard'));
const Login = lazy(() => import('../pages/login'));
const NotFound = lazy(() => import('../pages/404'));
const FormBuilder = lazy(() => import('../pages/build'));

// 加载组件
const LazyLoad = (Component: React.LazyExoticComponent<any>) => (
  <Suspense fallback={<div className="page-loading">加载中...</div>}>
    <Component />
  </Suspense>
);

const router = createBrowserRouter([
  {
    path: '/',
    element: <MainLayout />,
    children: [
      {
        path: '/',
        element: <Navigate to="/dashboard" replace />,
      },
      {
        path: '/dashboard',
        element: LazyLoad(Dashboard),
      },
      {
        path: '/user-list',
        element: <div className="coming-soon">用户列表页面 - 开发中</div>,
      },
      {
        path: '/role-manage',
        element: <div className="coming-soon">角色管理页面 - 开发中</div>,
      },
      {
        path: '/dept',
        element: <div className="coming-soon">部门管理页面 - 开发中</div>,
      },
      {
        path: '/menu',
        element: <div className="coming-soon">菜单管理页面 - 开发中</div>,
      },
      {
        path: '/dict',
        element: <div className="coming-soon">字典管理页面 - 开发中</div>,
      },
      {
        path: '/online',
        element: <div className="coming-soon">在线用户页面 - 开发中</div>,
      },
      {
        path: '/job',
        element: <div className="coming-soon">定时任务页面 - 开发中</div>,
      },
      {
        path: '/server',
        element: <div className="coming-soon">服务监控页面 - 开发中</div>,
      },
      {
        path: '/build',
        element: LazyLoad(FormBuilder),
      },
      {
        path: '/swagger',
        element: <div className="coming-soon">系统接口页面 - 开发中</div>,
      },
      {
        path: '/operlog',
        element: <div className="coming-soon">操作日志页面 - 开发中</div>,
      },
      {
        path: '/logininfor',
        element: <div className="coming-soon">登录日志页面 - 开发中</div>,
      },
      {
        path: '/system',
        name: '系统管理',
        icon: 'SettingOutlined',
        children: [
          {
            path: '/system/user',
            name: '用户管理',
            component: './system/User',
            access: 'canAdmin',
          },
          {
            path: '/system/role',
            name: '角色管理',
            component: './system/Role',
            access: 'canAdmin',
          },
          {
            path: '/system/menu',
            name: '菜单管理',
            component: './system/Menu',
            access: 'canAdmin',
          },
          {
            path: '/system/dict',
            name: '字典管理',
            component: './system/Dict',
            access: 'canAdmin',
          },
          {
            path: '/system/log',
            name: '操作日志',
            component: './system/Log',
            access: 'canAdmin',
          },
        ],
      },
      {
        path: '*',
        element: LazyLoad(NotFound),
      },
    ],
  },
  {
    path: '/login',
    element: LazyLoad(Login),
  },
]);

export default router; 